<template class="container">
    <div style="position: absolute; z-index: 10; left: 0px; top: 0px; height: 40px; width: 100%; display: flex; align-items: center;">
        <div style="height: 30px; line-height: 30px; width: 80px; text-align: center; color: #ffffff;">UI 预览</div>
        <select v-bind:value="WindowSize" v-bind:options="WindowSizeOptions" onselect=OnWindowSizeChange isAllowCreate=true></select>
    </div>
    <div style="position: absolute; left: 2px; top: 40px; right: 2px; bottom: 2px; background-color: #c8c8c8f0;">
        <component v-bind:template="TemplateCode"></component>
    </div>
</template>

<script type="text/lua" src="%ui%/Blockly/Pages/UIPreview.lua">
</script>


<style scoped=true>
.container {
    width: 100%;
    height: 100%;
    background-color: #191C13;
}
</style>
